<template>
  <header class="header">
    <todo-list
      :original="original"
      :editing="editing"
      :displayType="displayType"
      :msg="msg"
      :list="list"
    >
      <h1>{{ msg }}</h1>
    </todo-list>
  </header>
</template>

<script>
// @ is an alias to /src
import TodoList from '../components/todo-list';
import { mapGetters } from 'vuex';

export default {
  name: 'home',
  components: {
    TodoList,
  },
  computed: {
    ...mapGetters('todoModule', [
      'msg',
      'original',
      'editing',
      'displayType',
      'list',
    ]),
    //mapGetters拿到的数据用：original="original"显示在当前vue，其他vue引用时用props
  },
};
</script>

<style scoped>
.header {
  max-width: 550px;
  margin: 0 auto;
}
</style>
